requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        'jquery': 'jquery-3.3.1',
        'bootstrap': '../bootstrap',
        'swiper': '../swiper',
        'api': '../api',

 


    },
    shim: {
        jquery: {
            exports: 'jquery'
        },
        bootstrap: {
            deps: ['jquery'],
            exports: 'bootstrap',
        },
        swiper: {
            deps: ['jquery'],
        },
        api: {
            deps: ['jquery'],
        },

    }
});

define([
    'jquery',
    'bootstrap',
    'swiper',
    'api',


], function($ , bootstrap , swiper , api) {
    'use strict'; 
    (function($) {
        jQuery.extend({
          a: function () {
              // 手机列表页选项卡切换
             const $subnav = $("#subnavbar .sitem").slice(0,3);
            //  console.log($subnav);
             const $tag = $("#subnavbar .sitem").eq(3);
            //  console.log($tag);
             $($subnav).click(function () {
                 $($subnav).each(function (index, element) {
                    //  console.log(index, element);
                     $(this).removeClass("active");
                     const $index = index;

                     const $t = $(".tag-view").get($index);
                    //  console.log($t);
                     $($t).removeClass("active");

                     const $mc = $(".mobile-content").get($index);
                    //  console.log($mc);
                     $($mc).removeClass("active");
                 });
                 $(this).addClass("active");
                 const $mcIndex = $(this).index();
                 


                 const $mc = $(".mobile-content").get($mcIndex);
                 $($mc).addClass("active");
             });

             $($tag).hover(function () {
                 // 防止active重名，改为light
                 $(this).addClass("light");
                 // 因为active只有一个，所以只需要找到索引就可以匹配
                 const $i = $("#subnavbar .row").find(".active").index();
                //  console.log($i);
                 const $a =  $(".option .tag-view").get($i);
                //  console.log($a);
                 $($a).addClass("active");
             },function () {
                 $(this).removeClass("light");
                const $i = $("#subnavbar .row").find(".active").index();
                const $a =  $(".option .tag-view").get($i);
                $($a).removeClass("active");
                $($a).hover(function () {
                    $($tag).addClass("light");
                    $(this).addClass("active");
                }, function () {
                    $($tag).removeClass("light");
                    $(this).removeClass("active");
                });
             });

             



          },
          b: function () {
                // 手机
                const $tagView = [
                    '<div class="tag-view">',
                        '<div class="container">',
                        '</div>',
                    '</div>',
                ].join('');
                $($tagView).clone().appendTo("#mobile-list .option");
                // console.log($tagView);
                
                // pc
                const $tagItem = '<div class="content-tag-item active"></div>';
                $($tagItem).clone().appendTo("#list .content-tag");

                //手机列表页选项卡的数据渲染
                const a = [
                    {
                        title: '菜系:',
                        text: [
                            '川菜'    ,        '湘菜'      ,      '粤菜'    ,        '鲁菜',
                            '浙菜'     ,       '苏菜'       ,     '淮扬菜'  ,       '闽菜'    ,   '徽菜'     ,       '云南菜'    ,     '港台美食',
                        ],

                    },
                    {
                        title: '类型:',
                        text: [
                            '主食',            '热菜' ,           '凉菜'   ,    '汤羹 '   ,   '小吃' ,
                        ],
                    },
                    {
                        title: '场景:',
                        text: [
                            '早餐',            '便当' ,           '健身食谱' ,      '婴儿食谱',
                        ],
                    }
                ];
                $(a).each(function (index, element) {
                    // console.log(index, element);
                    const $index = index;
                    const $title = element.title;
                    const $texts = element.text;
                    // console.log($texts);
                    const $dls = '<dl></dl>';  
                    const $dts = '<dt></dt>';
                    const $dds = '<dd><a href="mobile-detail.html"></a></dd>';        
                    $($dls)
                        .clone().appendTo(".tag-view .container")
                        .addClass("clearfix")
                        .append($dts).clone()
                        .end().find("dt").text($title)
                        .end().clone().appendTo(".content-tag-item").removeClass("clearfix")
                        
                    
                    const $dl = $(".tag-view dl").get($index);


                    const $tagdl = $(".content-tag-item dl").get($index);

                    


                    $($texts).each(function (index, element) {


                        $($dds)
                            .clone().appendTo($dl)
                            .find("a").text(element)
                            .end().clone().appendTo($tagdl)
                         
                    });
                });

                // 手机列表页的数据渲染
                const b = [
                    {
                        img: 'image/list/mobile-2.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈.....',
                        total: '203',
                        text: '每一位孕妈妈都希望自己的宝宝能够健康成长除了小心。',
                        btn: [
                            '饮食常识','食疗食补','母婴健康',
                        ],
                    },{
                        img: 'image/list/mobile-3.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈.....',
                        total: '203',
                        text: '每一位孕妈妈都希望自己的宝宝能够健康成长除了小心。',
                        btn: [
                            '饮食常识','食疗食补','母婴健康',
                        ],
                    },{
                        img: 'image/list/mobile-4.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈.....',
                        total: '203',
                        text: '每一位孕妈妈都希望自己的宝宝能够健康成长除了小心。',
                        btn: [
                            '饮食常识','食疗食补','母婴健康',
                        ],
                    },{
                        img: 'image/list/mobile-5.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈.....',
                        total: '203',
                        text: '每一位孕妈妈都希望自己的宝宝能够健康成长除了小心。',
                        btn: [
                            '饮食常识','食疗食补','母婴健康',
                        ],
                    }
                ];
                const $media = [
                    '<div class="media">',
                        '<div class="media-left">',
                            '<a href="mobile-detail.html"><img class="media-object" src="" alt=""></a>',
                        '</div>',
                        '<div class="media-body">',
                            '<h4 class="media-heading"><a href="mobile-detail.html"></a></h4>',
                            '<span></span>',
                            '<p></p>',
                            '<p>',
                            '<a href="mobile-detail.html" class="btn btn-default" role="button"></a>',
                            '<a href="mobile-detail.html" class="btn btn-default" role="button"></a>',
                            '<a href="mobile-detail.html" class="btn btn-default" role="button"></a>',
                            '</p>',
                        '</div>',
                    '</div>',
                ].join('');
                // console.log($media);
                $(b).each(function (index, element) {
                    // console.log(index, element);
                    $(".mobile-content .container").append($media).clone();
                    const $index = index;
                    const $lists = $(".mobile-content .media").get($index);
                    // console.log($lists);
                    $($lists).find(".media-left img").attr("src",element.img)
                    .end().find(".media-heading a").text(element.title)
                    .end().find(".media-body span").text(element.total+'人阅读')
                    .end().find("p").first().text(element.text);
                    const $btns = element.btn;
                    $($btns).each(function (index, element) {
                        // console.log(index, element);
                        const btnIndex = index;
                        const $a = $($lists).find("p a").get(btnIndex);
                        // console.log($a);
                        $($a).text(element);
                    });
                    
                });
                
                // pc列表页的数据的渲染
                const c = [
                '<div class="media">',
                    '<div class="media-left">',
                      '<a href="mobile-detail.html"><img src="" alt="" class="media-object"></a>',
                    '</div>',
                    '<div class="media-body">',
                      '<h4 class="media-heading"><a href="mobile-detail.html"></a></h4>',
                      '<span></span>',
                      '<p></p>',
                      '<p>',
                      '</p>',
                    '</div>',
                '</div>',
                ].join('');
                const $cBtn = '<a href="mobile-list.html" class="btn btn-default" role="button"></a>';
                // console.log(c);

                // pc列表页的图片渲染以及其他数据的修改
                const d = [
                    {
                        img: 'image/list/未标题-5.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈要格外小心！',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                        
                    },
                    {
                        img: 'image/list/未标题-6.jpg',
                        title: '老人健忘，吃这些可增强记忆力！',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['川菜','湘菜','汤羹','母婴健康'],
                        
                    },
                    {
                        img: 'image/list/未标题-7.jpg',
                        title: '胃寒？快来吃这7种食物养养胃吧！',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],

                    },
                    {
                        img: 'image/list/未标题-8.jpg',
                        title: '10种越吃越聪明的食物',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],

                    },
                    {
                        img: 'image/list/未标题-9.jpg',
                        title: '小孩子应该多吃哪些蔬菜？',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                        
                    },
                    {
                        img: 'image/list/未标题-10.jpg',
                        title: '怀孕时的饮食禁忌，孕妈妈要格外小心！',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                    },
                    {
                        img: 'image/list/未标题-11.jpg',
                        title: '盘点好吃又抗癌的小零食',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                    },
                    {
                        img: 'image/list/未标题-13.jpg',
                        title: '怀秋天就是容易脱发吗？',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                    },
                    {
                        img: 'image/list/未标题-14.jpg',
                        title: '吃螃蟹要注意什么？5类女人不适合吃',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                    },
                    {
                        img: 'image/list/未标题-15.jpg',
                        title: '早餐应该包含至少5种要素',
                        total: '203',
                        content: '每一位孕妈妈都希望自己的宝宝能够健康成长除了在行动方面要格外小心。',
                        keyword: ['饮食常识','食疗食补','母婴健康'],
                    },
                ];
                // console.log(d);
                const $l = $(".list-content").slice(0);
                $(d).each(function (index, element) {
                    // console.log(index, element);
                    // $(c).clone().appendTo(".content-media");
                    $($l)
                        .find(".content-media")
                        .append(c).clone()
                    const $index = index;
                    const $m = $(".content-media .media").get($index);
                    // 如果没反应又不报错，那就是标签不存在
                    $($m)
                        .find(".media-left img").attr("src", element.img)
                        .end().find("h4 a").text(element.title)
                        .end().find("span").text(element.total+'人阅读')
                        .end().find("p").first().text(element.content);
                    $(element.keyword).each((index, element) => {
                        // console.log(index, element);
                        const $btnIndex = index;
                        const $btn = '<a href="" class="btn btn-default" role="button"></a>';
                        $($m).find("p").last().append($btn).clone()
                        const $aBtn = $($m).find("p a").get($btnIndex);
                        $($aBtn).text(element);
                    });
                });
                
          },
          c: function() {   
              $(".content-header-item").click(function () {
                  console.log("点击了");
                  $(".content-header-item").each( function (index, element) {
                      $(this).removeClass("active");
                      const $index = index;
                      const $item = $(".content-tag-item").get($index);
                      $($item).removeClass("active");
                      const $l = $(".list-content").get($index);
                      $($l).removeClass("active");
                  });
                  $(this).addClass("active");
                  const $tagIndex = $(this).index();
                //   console.log($tagIndex);
                  const $tagItem = $(".content-tag-item").get($tagIndex);
                  $($tagItem).addClass("active");
                  const $l = $(".list-content").get($tagIndex);
                  $($l).addClass("active");
              });
          },
          d: function () {
              console.log('d');
          }


        });
    })(jQuery);
    $.b();
    $.a();
    $.c();
    $.d();

    
});